<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h1>passivity refresh page!</h1>
<div id="message"></div>
<div>
    <textarea id="msg" rows="3" cols="20"></textarea>
    <a href="javascript:;" onclick="sendMsg()">发送</a>
</div>
</body>
<script src="../static/jquery-3.4.1.min.js"></script>
<script>


    //将消息显示在网页上

    function setMessageInnerHTML(innerHTML) {

        document.getElementById('message').innerHTML = innerHTML + '<br/>';

    }

    //关闭WebSocket连接

    function closeWebSocket() {

        websocket.close();

    }


    let websocket = null;

    //判断当前浏览器是否支持WebSocket

    if ('WebSocket' in window) {

        //建立连接，这里的/websocket ，是ManagerServlet中开头注解中的那个值

        websocket = new WebSocket("ws://localhost:8012/message/passivityRefresh");

    } else {

        alert('当前浏览器 Not support websocket')

    }

    //连接发生错误的回调方法

    websocket.onerror = function () {

        setMessageInnerHTML("WebSocket连接发生错误");

    };

    //连接成功建立的回调方法

    websocket.onopen = function () {

        setMessageInnerHTML("WebSocket连接成功");

    };

    //接收到消息的回调方法

    websocket.onmessage = function (event) {

        setMessageInnerHTML(event.data);

        // if (event.data === "1") {
        //
        //     location.reload();
        //
        // }

    };

    //连接关闭的回调方法

    websocket.onclose = function () {

        setMessageInnerHTML("WebSocket连接关闭");


    };

    //监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。

    window.onbeforeunload = function () {

        closeWebSocket();
    };


    function sendMsg() {
        let msg = $("#msg").val();
        websocket.send(msg);
        $("#msg").val("");
    }
</script>
</html>